| Conditions | 1 |
| Paths | 2 |
| Total Lines | 404 |
| Lines | 0 |
| Ratio | 0 % |
| Changes | 1 | ||
| Bugs | 0 | Features | 0 |
Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.
For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.
Commonly applied refactorings include:
If many parameters/temporary variables are present:
| 1 | const GitAmp = (function(exports, $) { |
||
| 2 | 'use strict'; |
||
| 3 | |||
| 4 | /** |
||
| 5 | * AudioPlayer |
||
| 6 | */ |
||
| 7 | const AudioPlayer = (function() { |
||
| 8 | const maxPitch = 100.0; |
||
| 9 | const logUsed = 1.0715307808111486871978099; |
||
| 10 | |||
| 11 | const maximumSimultaneousNotes = 2; |
||
| 12 | const soundLength = 300; |
||
| 13 | |||
| 14 | function AudioPlayer() { |
||
| 15 | this.currentlyPlayingSounds = 0; |
||
| 16 | |||
| 17 | this.sounds = { |
||
| 18 | celesta: this.initializeCelesta(), |
||
| 19 | clav: this.initializeClav(), |
||
| 20 | swells: this.initializeSwells() |
||
| 21 | }; |
||
| 22 | |||
| 23 | //noinspection JSUnresolvedVariable |
||
| 24 | exports.Howler.volume(volume); |
||
| 25 | } |
||
| 26 | |||
| 27 | AudioPlayer.prototype.initializeCelesta = function() { |
||
| 28 | const sounds = []; |
||
| 29 | |||
| 30 | for (let i = 1; i <= 24; i++) { |
||
| 31 | let filename = (i > 9) ? 'c0' + i : 'c00' + i; |
||
| 32 | |||
| 33 | //noinspection JSUnresolvedFunction |
||
| 34 | sounds.push(new Howl({ |
||
|
|
|||
| 35 | src : [ |
||
| 36 | 'https://d1fz9d31zqor6x.cloudfront.net/sounds/celesta/' + filename + '.ogg', |
||
| 37 | 'https://d1fz9d31zqor6x.cloudfront.net/sounds/celesta/' + filename + '.mp3' |
||
| 38 | ], |
||
| 39 | volume : 0.7, |
||
| 40 | buffer: true |
||
| 41 | })); |
||
| 42 | } |
||
| 43 | |||
| 44 | return sounds; |
||
| 45 | }; |
||
| 46 | |||
| 47 | AudioPlayer.prototype.initializeClav = function() { |
||
| 48 | const sounds = []; |
||
| 49 | |||
| 50 | for (let i = 1; i <= 24; i++) { |
||
| 51 | let filename = (i > 9) ? 'c0' + i : 'c00' + i; |
||
| 52 | |||
| 53 | //noinspection JSUnresolvedFunction |
||
| 54 | sounds.push(new Howl({ |
||
| 55 | src : [ |
||
| 56 | 'https://d1fz9d31zqor6x.cloudfront.net/sounds/clav/' + filename + '.ogg', |
||
| 57 | 'https://d1fz9d31zqor6x.cloudfront.net/sounds/clav/' + filename + '.mp3' |
||
| 58 | ], |
||
| 59 | volume : 0.7, |
||
| 60 | buffer: true |
||
| 61 | })); |
||
| 62 | } |
||
| 63 | |||
| 64 | return sounds; |
||
| 65 | }; |
||
| 66 | |||
| 67 | AudioPlayer.prototype.initializeSwells = function() { |
||
| 68 | const sounds = []; |
||
| 69 | |||
| 70 | for (let i = 1; i <= 3; i++) { |
||
| 71 | //noinspection JSUnresolvedFunction |
||
| 72 | sounds.push(new Howl({ |
||
| 73 | src : [ |
||
| 74 | 'https://d1fz9d31zqor6x.cloudfront.net/sounds/swells/swell' + i + '.ogg', |
||
| 75 | 'https://d1fz9d31zqor6x.cloudfront.net/sounds/swells/swell' + i + '.mp3' |
||
| 76 | ], |
||
| 77 | volume : 0.7, |
||
| 78 | buffer: true |
||
| 79 | })); |
||
| 80 | } |
||
| 81 | |||
| 82 | return sounds; |
||
| 83 | }; |
||
| 84 | |||
| 85 | AudioPlayer.prototype.getSoundIndex = function(size, type) { |
||
| 86 | const pitch = 100 - Math.min(maxPitch, Math.log(size + logUsed) / Math.log(logUsed)); |
||
| 87 | let index = Math.floor(pitch / 100.0 * this.sounds[type].length); |
||
| 88 | |||
| 89 | index += Math.floor(Math.random() * 4) - 2; |
||
| 90 | index = Math.min(this.sounds[type].length - 1, index); |
||
| 91 | index = Math.max(1, index); |
||
| 92 | |||
| 93 | return index; |
||
| 94 | }; |
||
| 95 | |||
| 96 | AudioPlayer.prototype.playSound = function(sound) { |
||
| 97 | if (this.currentlyPlayingSounds >= maximumSimultaneousNotes) { |
||
| 98 | return; |
||
| 99 | } |
||
| 100 | |||
| 101 | sound.play(); |
||
| 102 | |||
| 103 | this.currentlyPlayingSounds++; |
||
| 104 | |||
| 105 | setTimeout(function() { |
||
| 106 | this.currentlyPlayingSounds--; |
||
| 107 | }.bind(this), soundLength); |
||
| 108 | }; |
||
| 109 | |||
| 110 | AudioPlayer.prototype.playCelesta = function(size) { |
||
| 111 | this.playSound(this.sounds.celesta[this.getSoundIndex(size, 'celesta')]); |
||
| 112 | }; |
||
| 113 | |||
| 114 | AudioPlayer.prototype.playClav = function(size) { |
||
| 115 | this.playSound(this.sounds.clav[this.getSoundIndex(size, 'clav')]); |
||
| 116 | }; |
||
| 117 | |||
| 118 | AudioPlayer.prototype.playSwell = function() { |
||
| 119 | this.playSound(this.sounds.swells[Math.round(Math.random() * (this.sounds.swells.length - 1))]); |
||
| 120 | }; |
||
| 121 | |||
| 122 | return AudioPlayer; |
||
| 123 | }()); |
||
| 124 | |||
| 125 | /** |
||
| 126 | * Gui |
||
| 127 | */ |
||
| 128 | const Gui = (function() { |
||
| 129 | function Gui() { |
||
| 130 | this.setupVolumeSlider(); |
||
| 131 | } |
||
| 132 | |||
| 133 | Gui.prototype.setupVolumeSlider = function() { |
||
| 134 | //noinspection JSUnresolvedFunction |
||
| 135 | $('#volumeSlider').slider({ |
||
| 136 | max: 100, |
||
| 137 | min: 0, |
||
| 138 | value: volume * 100, |
||
| 139 | slide: function (event, ui) { |
||
| 140 | //noinspection JSUnresolvedVariable |
||
| 141 | exports.Howler.volume(ui.value/100.0); |
||
| 142 | }, |
||
| 143 | change: function (event, ui) { |
||
| 144 | //noinspection JSUnresolvedVariable |
||
| 145 | exports.Howler.volume(ui.value/100.0); |
||
| 146 | } |
||
| 147 | }); |
||
| 148 | }; |
||
| 149 | |||
| 150 | return Gui; |
||
| 151 | }()); |
||
| 152 | |||
| 153 | /** |
||
| 154 | * ConnectedUsersMessage |
||
| 155 | */ |
||
| 156 | function ConnectedUsersMessage(response) { |
||
| 157 | //noinspection JSUnresolvedVariable |
||
| 158 | this.count = response.connectedUsers; |
||
| 159 | } |
||
| 160 | |||
| 161 | ConnectedUsersMessage.prototype.getCount = function() { |
||
| 162 | return this.count; |
||
| 163 | }; |
||
| 164 | |||
| 165 | /** |
||
| 166 | * EventMessage |
||
| 167 | */ |
||
| 168 | function EventMessage(event) { |
||
| 169 | this.event = event; |
||
| 170 | } |
||
| 171 | |||
| 172 | EventMessage.prototype.getId = function() { |
||
| 173 | //noinspection JSUnresolvedVariable |
||
| 174 | return this.event.id; |
||
| 175 | }; |
||
| 176 | |||
| 177 | EventMessage.prototype.getType = function() { |
||
| 178 | //noinspection JSUnresolvedVariable |
||
| 179 | return this.event.type; |
||
| 180 | }; |
||
| 181 | |||
| 182 | EventMessage.prototype.getAction = function() { |
||
| 183 | //noinspection JSUnresolvedVariable |
||
| 184 | return this.event.action; |
||
| 185 | }; |
||
| 186 | |||
| 187 | EventMessage.prototype.getRepositoryName = function() { |
||
| 188 | //noinspection JSUnresolvedVariable |
||
| 189 | return this.event.repoName; |
||
| 190 | }; |
||
| 191 | |||
| 192 | EventMessage.prototype.getActorName = function() { |
||
| 193 | //noinspection JSUnresolvedVariable |
||
| 194 | return this.event.actorName; |
||
| 195 | }; |
||
| 196 | |||
| 197 | EventMessage.prototype.getUrl = function() { |
||
| 198 | //noinspection JSUnresolvedVariable |
||
| 199 | return this.event.eventUrl; |
||
| 200 | }; |
||
| 201 | |||
| 202 | EventMessage.prototype.getMessage = function() { |
||
| 203 | //noinspection JSUnresolvedVariable |
||
| 204 | return this.event.message; |
||
| 205 | }; |
||
| 206 | |||
| 207 | /** |
||
| 208 | * EventMessageCollection |
||
| 209 | */ |
||
| 210 | function EventMessageCollection(response) { |
||
| 211 | this.events = []; |
||
| 212 | |||
| 213 | for (let i = 0; i < response.length; i++) { |
||
| 214 | this.events.push(new EventMessage(response[i])); |
||
| 215 | } |
||
| 216 | } |
||
| 217 | |||
| 218 | EventMessageCollection.prototype.forEach = function(callback) { |
||
| 219 | for (let i = 0; i < this.events.length; i++) { |
||
| 220 | callback(this.events[i]); |
||
| 221 | } |
||
| 222 | }; |
||
| 223 | |||
| 224 | /** |
||
| 225 | * EventMessagesFactory |
||
| 226 | */ |
||
| 227 | function EventMessagesFactory () { |
||
| 228 | } |
||
| 229 | |||
| 230 | EventMessagesFactory.prototype.build = function(response) { |
||
| 231 | const parsedResponse = JSON.parse(response.data); |
||
| 232 | |||
| 233 | if (parsedResponse.hasOwnProperty('connectedUsers')) { |
||
| 234 | return new ConnectedUsersMessage(parsedResponse); |
||
| 235 | } |
||
| 236 | |||
| 237 | return new EventMessageCollection(parsedResponse); |
||
| 238 | }; |
||
| 239 | |||
| 240 | /** |
||
| 241 | * EventQueue |
||
| 242 | */ |
||
| 243 | function EventQueue() { |
||
| 244 | this.queue = []; |
||
| 245 | } |
||
| 246 | |||
| 247 | EventQueue.prototype.append = function(eventMessages) { |
||
| 248 | eventMessages.forEach(function(event) { |
||
| 249 | if (this.exists(event)) { |
||
| 250 | return; |
||
| 251 | } |
||
| 252 | |||
| 253 | this.queue.push(event); |
||
| 254 | }.bind(this)); |
||
| 255 | |||
| 256 | if (this.queue.length > 1000) { |
||
| 257 | this.queue = this.queue.slice(0, 1000); |
||
| 258 | } |
||
| 259 | }; |
||
| 260 | |||
| 261 | EventQueue.prototype.exists = function(event) { |
||
| 262 | for (let i = 0; i < this.queue.length; i++) { |
||
| 263 | if (event.getId() === this.queue[i].getId()) { |
||
| 264 | return true; |
||
| 265 | } |
||
| 266 | } |
||
| 267 | |||
| 268 | return false; |
||
| 269 | }; |
||
| 270 | |||
| 271 | EventQueue.prototype.get = function() { |
||
| 272 | return this.queue.shift(); |
||
| 273 | }; |
||
| 274 | |||
| 275 | EventQueue.prototype.count = function() { |
||
| 276 | return this.queue.length; |
||
| 277 | }; |
||
| 278 | |||
| 279 | /** |
||
| 280 | * Connection |
||
| 281 | */ |
||
| 282 | function Connection(eventMessageFactory) { |
||
| 283 | this.eventMessageFactory = eventMessageFactory; |
||
| 284 | |||
| 285 | this.connection = null; |
||
| 286 | this.handlers = []; |
||
| 287 | } |
||
| 288 | |||
| 289 | Connection.prototype.start = function() { |
||
| 290 | let protocol = 'ws://'; |
||
| 291 | |||
| 292 | if (exports.location.protocol === "https:") { |
||
| 293 | protocol = 'wss://'; |
||
| 294 | } |
||
| 295 | |||
| 296 | this.connection = new WebSocket(protocol + exports.location.host + '/ws'); |
||
| 297 | |||
| 298 | this.connection.addEventListener('message', this.handleMessage.bind(this)); |
||
| 299 | this.connection.addEventListener('open', this.handleOpen.bind(this)); |
||
| 300 | this.connection.addEventListener('close', this.handleClose.bind(this)); |
||
| 301 | this.connection.addEventListener('error', this.handleError.bind(this)); |
||
| 302 | }; |
||
| 303 | |||
| 304 | Connection.prototype.registerHandler = function(handler) { |
||
| 305 | this.handlers.push(handler); |
||
| 306 | }; |
||
| 307 | |||
| 308 | Connection.prototype.handleMessage = function(response) { |
||
| 309 | const message = this.eventMessageFactory.build(response); |
||
| 310 | |||
| 311 | for (let i = 0; i < this.handlers.length; i++) { |
||
| 312 | this.handlers[i](message); |
||
| 313 | } |
||
| 314 | }; |
||
| 315 | |||
| 316 | Connection.prototype.handleOpen = function() { |
||
| 317 | document.getElementsByTagName('svg')[0].style.backgroundColor = svg_background_color_online; |
||
| 318 | document.getElementsByTagName('header')[0].style.backgroundColor = svg_background_color_online; |
||
| 319 | |||
| 320 | const elements = document.querySelectorAll('.events-remaining-text, .events-remaining-value, .online-users-div'); |
||
| 321 | |||
| 322 | for (let i = 0; i < elements.length; i++) { |
||
| 323 | elements[i].style.visibility = 'visible'; |
||
| 324 | } |
||
| 325 | }; |
||
| 326 | |||
| 327 | Connection.prototype.handleClose = function() { |
||
| 328 | document.getElementsByTagName('svg')[0].style.backgroundColor = svg_background_color_offline; |
||
| 329 | document.getElementsByTagName('header')[0].style.backgroundColor = svg_background_color_offline; |
||
| 330 | |||
| 331 | this.connection = null; |
||
| 332 | }; |
||
| 333 | |||
| 334 | Connection.prototype.handleError = function() { |
||
| 335 | this.handleClose(); |
||
| 336 | |||
| 337 | const reTryInterval = setInterval(function() { |
||
| 338 | if (this.connection !== null) { |
||
| 339 | clearInterval(reTryInterval); |
||
| 340 | |||
| 341 | return; |
||
| 342 | } |
||
| 343 | |||
| 344 | this.start(); |
||
| 345 | }.bind(this), 5000); |
||
| 346 | }; |
||
| 347 | |||
| 348 | /** |
||
| 349 | * Application |
||
| 350 | */ |
||
| 351 | function Application() { |
||
| 352 | this.queue = new EventQueue(); |
||
| 353 | this.audio = new AudioPlayer(); |
||
| 354 | this.gui = new Gui(); |
||
| 355 | } |
||
| 356 | |||
| 357 | Application.prototype.run = function() { |
||
| 358 | const connection = new Connection(new EventMessagesFactory()); |
||
| 359 | |||
| 360 | connection.registerHandler(this.process.bind(this)); |
||
| 361 | |||
| 362 | connection.start(); |
||
| 363 | |||
| 364 | this.loop(); |
||
| 365 | }; |
||
| 366 | |||
| 367 | Application.prototype.process = function(message) { |
||
| 368 | if (message instanceof ConnectedUsersMessage) { |
||
| 369 | document.getElementsByClassName('online-users-count')[0].textContent = message.getCount(); |
||
| 370 | |||
| 371 | return; |
||
| 372 | } |
||
| 373 | |||
| 374 | this.queue.append(message); |
||
| 375 | }; |
||
| 376 | |||
| 377 | Application.prototype.loop = function() { |
||
| 378 | setTimeout(function() { |
||
| 379 | this.processEvent(this.queue.get()); |
||
| 380 | |||
| 381 | document.getElementsByClassName('events-remaining-value')[0].textContent = this.queue.count(); |
||
| 382 | |||
| 383 | this.loop(); |
||
| 384 | }.bind(this), Math.floor(Math.random() * 1000) + 500); |
||
| 385 | }; |
||
| 386 | |||
| 387 | Application.prototype.processEvent = function(event) { |
||
| 388 | if (!event.getMessage()) { |
||
| 389 | return; |
||
| 390 | } |
||
| 391 | |||
| 392 | if (event.getType() === 'IssuesEvent' || event.getType() === 'IssueCommentEvent') { |
||
| 393 | this.audio.playClav(event.getMessage().length * 1.1); |
||
| 394 | } else if(event.getType() === 'PushEvent') { |
||
| 395 | this.audio.playCelesta(event.getMessage().length * 1.1); |
||
| 396 | }else{ |
||
| 397 | this.audio.playSwell(); |
||
| 398 | } |
||
| 399 | |||
| 400 | drawEvent(event, svg); |
||
| 401 | }; |
||
| 402 | |||
| 403 | return Application; |
||
| 404 | }(window, jQuery)); |
||
| 405 | |||
| 566 |
This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.
To learn more about declaring variables in Javascript, see the MDN.